<template>
	<view class="remindpage">
	
		<view class="evenbox" :class="dataid==item.id?'outday':''" v-for="item in list" :key="item.id" @click="deleven(item.id)">
			<view class="iconfont icon-dian1">
				
			</view>
			<view class="day">
				{{item.erTime.slice(0, -3)}}
			</view>
			<view class="box">
				<view class="label">
					{{item.erContent}}
				</view>
				<view class="dateline">
					<view class="iconfont icon-shizhong">
						
					</view>
					<view class="time">
						{{item.erType==0?'每天':item.erType==1?"每周":'不重复'}}
					</view>
					<view class="pinlv">
						{{item.weeks||''}}
					</view>
				</view>
			</view>
		</view>

		<view class= "tabbox">
			<view class="itemtab" @click="shanchu">
				<view class="iconfont icon-shanchu">
					
				</view>
				<view class="item">
					删除
				</view>
			</view>
			<view class="itemtab" @click="addeven">
				<view class="iconfont icon-tianjia">
					
				</view>
				<view class="item">
					添加
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	
	import {eventsList,getDictData,deleteEvent} from '../../utils/api.js'
	export default {
		data() {
			return {
				list:[],
				dataid:'',
				shijianlist:[],
				label:''
			}
		},
		onLoad(e) {
		    this.label=e.label
		    let b={
		    	type:'sys_shijiantixingbiaoqian'
		    }
		    getDictData(b).then(res=>{
		    	
		    	this.shijianlist=res.data.data
		    })
			
			 
			
			 
		},
		onShow() {
			let p={
							 phone:uni.getStorageSync('phone'),
							erLabel:this.label
						}
						eventsList(p).then(res=>{
			this.list = res.data.data.map(item => {
			  const dict = this.shijianlist.find(d => String(d.dictValue) === String(item.erLabel))
			  return {
			    ...item,
			    erLabelText: dict ? dict.dictLabel : item.erLabel
			  }
			
			})
						}) 
		},
		methods: {
			addeven(){
				uni.navigateTo({
					url:'/pagesB/addeven/addeven'
				})
			},
			shanchu(){
				let that=this
			if(that.dataid==''){
				uni.showToast({
					title: '请选择要删除的事件',
					icon:'none',
					duration: 2000
				});

			}
				uni.showModal({
					title: '提示',
					content: '确定要删除事件吗？',
					success: function (res) {
						if (res.confirm) {
							let p={
								eventId:that.dataid
							}
							deleteEvent(p).then(res=>{
								console.log(res)
								if(res.data.code==200){
									uni.showToast({
										title: '删除成功',
										icon:'none',
										duration: 2000
									});
									let p={
													 phone:uni.getStorageSync('phone'),
													erLabel:that.label
												}
												eventsList(p).then(res=>{
									that.list = res.data.data.map(item => {
									  const dict = that.shijianlist.find(d => String(d.dictValue) === String(item.erLabel))
									  return {
									    ...item,
									    erLabelText: dict ? dict.dictLabel : item.erLabel
									  }
									
									})
												}) 
								}
							})
							console.log('用户点击确定');
						} else if (res.cancel) {
							console.log('用户点击取消');
						}
					}
				});

			},
			deleven(e){
				this.dataid=e
			},
			getlist(e,a){
				let p={
					phone:uni.getStorageSync('phone'),
					selectName:e,
					type:a
				}
				changbanInfoDataType(p).then(res=>{
					console.log(res)
					this.list=res.data.data
				})
			},
		}
	}
</script>

<style lang="less" scoped>
   .remindpage{
	   width: 750rpx;
	   box-sizing: border-box;
	 background: linear-gradient(180deg, rgba(242,248,255,1) 0%,rgba(255,255,255,0) 76%);
	   padding: 20rpx;
	   padding-bottom: 150rpx;
	   .title{
		   font-size: 34rpx;
		   font-weight: bold;
		   color: #2F2F2F;
	   }
	   .outday{
	   			   .iconfont{
					    color: #1a4f8a  !important;
				   }
				   .box{
					   background-color: #1a4f8a  !important;
					  
					   .iconfont{
					   					   font-size: 36rpx;
					   					   color: white !important;
					   					   margin-right: 20rpx;
					   }
				   }
	   }
	   .evenbox{
		   width: 90%;
		   display: flex;
		   align-items: center;
		   justify-content: space-between;
		margin-top: 30rpx;
		   .iconfont{
			    color: #C2C2C2 ;
			  
			   font-size: 70rpx;
		   }
		   .day{
			   font-weight: bold;
		   }
		   
		   
		   .box{
			   width: 80%;
			    background-color: #C2C2C2;
			   color: white;
			   border-top-right-radius: 20rpx;
			   border-bottom-left-radius:20rpx ;
			   border-bottom-right-radius: 20rpx;
			   margin-left: 20rpx;
			   box-sizing: border-box;
			   padding: 20rpx;
			   .label{
				   font-weight: bold;
				   line-height: 2.5;
			   }
			   .dateline{
				   display: flex;
				   align-items: center;
				   font-size: 30rpx;
				  
				   .iconfont{
					   font-size: 36rpx;
					   color: white;
					   margin-right: 20rpx;
				   }
				   .time{
					   margin-right: 20rpx;
				   }
			   }
		   }
		   
	   }
	   .tabbox{
		   width: 750rpx;
		   height: 160rpx;
		   background-color: white;
		   justify-content: space-evenly;
		   position: fixed;
		   left: 0;
		   bottom: 0;
		   box-sizing: border-box;
		   padding: 10rpx 30rpx;
		   display: flex;
		   align-items: center;
		   text-align: center;
		   .itemtab{
			   color:#B1B1B1 ;
			   font-size: 30rpx;
			   width: 50%;
			   text-align: center;
			   .iconfont{
				   font-size: 40rpx;
				   margin-bottom: 10rpx;
			   }
			   
		   }
		   
		   
	   }
	   
   }
</style>
